// isLogin()

function applyData(json) {
	let str = ''
	json.forEach(item => {
		// console.log(item)
        str += 
        `
        <div class="col-md-4 col-sm-6 col-lg-4" data-id="${item.id}">
        <div class="popular-dish-box style2 wow fadeIn" data-wow-delay="0.2s">
            <div class="popular-dish-thumb">
                <a href="food-detail.html"><img src="${item.img}" alt="popular-dish-img1.jpg"></a>
                <span class="post-rate yellow-bg brd-rd2"><i class="fa fa-star-o"></i> 4.25</span>
            </div>
            <div class="popular-dish-info">
                <h4><a href="food-detail.html">${item.title}</a></h4>
                <p>红烧肉是一道著名的大众菜肴，属于鲁菜。其以五花肉为制作主料，最好选用肥瘦相间的三层肉（五花肉）来做，锅具以砂锅为主，做出来的肉肥瘦相间，香甜松软，入口即化。</p>
                <span class="price">￥${item.price}.00</span>
                <a class="brd-rd4 " href="food-detail.html">加入购物车</a>
                <div class="restaurant-info">
                    <img src="assets/images/resource/restaurant-logo1.png" alt="restaurant-logo1.png">
                    <div class="restaurant-info-inner">
                        <h6><a href="javascript:;">广东省深圳市宝安区  </a></h6>
                        <span class="red-clr">西乡街道航城大道38号</span>
                    </div>
                </div>
            </div>
        </div><!-- Popular Dish Box -->
    </div>
        `
	})
	$('#list-boxs').html(str)
}

//封装拿数据
function get() {
	$.ajax({
		url: 'assets/js/food.json',
		// dataType: 'json',
		type: 'GET',
		success: function(res) {
			applyData(res.slice(0, 9))

			//渲染分页器
			$("#page").paging({
				nowPage: 1, // 当前页码,默认为1
				pageNum: Math.ceil(res.length / 9), // 总页码
				// buttonNum: 3, //要展示的页码数量，默认为7，若小于5则为5
				callback: function(num) { //回调函数,num为当前页码
					// console.log(num)
					//根据页码渲染数据
					let list = res.slice((num - 1) * 9, num * 9)
					// console.log(list)
					applyData(list)
				}
			});
		}
	})
}
get()

// 根据点击的商品存入id
setItemInfo('#list-boxs', '.col-md-4')